<template>
  <div class="wrapper p-4">
    <div class="mb-3">
      <label class="w70 text-right">调光值：</label>
      <el-input-number class="w200" v-model="LightLevel"  size="small"  :min="0" :max="100"></el-input-number>
    </div>
    <div>
      <label class="w70 text-right">操作密码：</label>
      <el-tooltip class="item" :content="errors.first('pwd')" :value="errors.has('pwd')" :manual="true">
        <el-input type="password" size="small" class="w200" :class="{'is-error':errors.has('pwd')}"  v-model="operatePwd" v-validate="'required'" name="pwd"></el-input>
      </el-tooltip>
    </div>
    <div class="mt-3 text-center">
      <el-button class="ur-btn w75 ml-2" type="info ur-btn-primary" @click="callFun" :disabled="btnState"><i class="iconfont icon-queding"></i>下发</el-button>
      <el-button class="ur-btn w75 ml-2" type="info ur-btn-primary" @click="close"><i class="iconfont icon-close1"></i>取消</el-button>
    </div>
  </div>
</template>

<script>
  import api from 'api/api'
  import {mapState} from 'vuex'
  export default {
    components: {},
    props: {
      boxs:null,
    },
    data() {
      return {
        LightLevel:0,
        operatePwd:'',
        callNum:{total:0,success:0,error:0},
      }
    },
    watch: {},
    computed: {
      ...mapState({
        btnState: state => state.user.btnState,
      })
    },
    methods: {
      callFun(){
        this.$validator.validateAll().then((res) => {
          let pIndex = 1
          let boxIds=[]
          if (res) {
            this.$store.commit('user/SET_USER_PWD', this.operatePwd)
            this.$store.commit('user/SET_BTN_STATE',true)
            this.boxs.map(box => {
              boxIds.push(box.BoxId)
              box.result = '下发控制中...'
              this.$emit('updateResult',{callNum:this.callNum,boxIds:boxIds})
              api.fetchSimple('/Communication/Rtu/AFN05F2', {devAddr:box.DevAddr,lightLevel:this.LightLevel,rtuXh:0})
                .then(r => {
                  box.opereaTime=api.formatDate(new Date(),'yyyy-MM-dd HH:mm:ss')
                  if (r.err) {
                    this.callNum.error = this.callNum.error+1
                    box.result = 0
                    box.resultInfo = r.err
                  } else {
                    this.callNum.success = this.callNum.success+1
                    box.result = 1
                    box.resultInfo = ''
                  }
                  let total = this.boxs.length
                  let pcen = Math.round(pIndex / total * 100) > 100 ? 100 : Math.round(pIndex / total * 100)
                  this.$emit('updateBar',pcen)
                  pIndex++
                  if (pcen==100) {
                    this.callNum.total = this.callNum.error + this.callNum.success
                    this.$emit('updateResult',{callNum:this.callNum,boxIds:boxIds})
                    this.$store.commit('user/SET_BTN_STATE',false)
                  }
                })
            })
          }
        })
      },
      close(){
        this.$emit('close',false)
      }
    },
    created() {
    },
    mounted() {
    }
  }
</script>
<style scoped lang="stylus" rel="stylesheet/stylus">
</style>
